<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
            *{
            padding: 0px;
            margin: 0px;
        }
.box{
     margin-top:  60px;
    margin: auto;
    width: 450px;
    height: 400px;
    background-color: rgb(255, 255, 255);
    margin-top: 50px;
}
.logo{
    margin: auto;
      width: 50px;
      height: 50px;
      background-color: rgb(228, 79, 41);
}
.text{
    padding-top: 30px;
    margin: auto;
          width:200px;
      height: 70px;
      background-color: rgb(255, 255, 255);
      text-align: center;
        font-size: 30px;
} 
.go{
 color: rgb(255, 255, 255);
            text-indent: 14px;
            border: 1px solid rgb(255, 76, 0);
            background: rgb(255, 76, 0);
            line-height: 46px;
            width: 385px;
            margin: auto auto 13px auto;
        }
.id{
 color: rgb(255, 255, 255);
            text-indent: 14px;
            border: 1px solid rgb(232, 232, 232);
            background: rgb(255, 255, 255);
            line-height: 46px;
            margin: auto auto 13px auto;
               width: 383px;
        }
.ID{
border: #ffffff;
color:  rgb(198, 204, 221);
border: #ffffff;
               width: 360px;
            height: 50px;
}
.gogo{
    background-color:  rgb(255, 76, 0);
    border: none;
color: #ffffff;
margin: auto;
margin-left: 162.3px;
}
</style>
<body>
   <div class="box">
        <div class="logo">
            <img src="../课堂作业/mi-logo.png">
        </div>
        <div class="text">
            <p>小米账号登录</p>
        </div>
        <div class="id">
            <input type="text" value="邮箱/手机/小米ID" class="ID">
        </div>
        <div class="id">
             <input type="text" value="邮箱/手机/小米ID" class="ID">
        </div>
        <div class="go">
        <input type="button" value="登录" class="gogo">
        </div>
   </div> 
</body>
</html>